import avatar from "../images/avatar.png";
import dayjs from 'dayjs' 
function List({list=[],changeAttitude,delList}) {
  // 格式化时间
const time=(time)=>{
  return dayjs(time).format('YYYY-MM-DD HH:mm:ss')
}
  return(
    <div className="comment-list">
    {list.map(item=>{
      return <div className="list-item" key={item.id}>
       <div className="user-face">
         <img className="user-head" src={avatar} alt="" />
       </div>
       <div className="comment">
         <div className="user">{item.author}</div>
         <p className="text">{item.comment}</p>
         <div className="info">
           <span className="time">{time(item.time)}</span>
           <span onClick={()=>changeAttitude(item.id,item.attitude === 1 ? 0 : 1)} className={item.attitude===1?"like liked":'like'}>
             <i className="icon" />
           </span>
           <span onClick={()=>changeAttitude(item.id,item.attitude === -1 ? 0 : -1)} className={item.attitude===-1?"hate hated":"hate"}>
             <i className="icon" />
           </span>
           <span onClick={()=>delList(item.id)} className="reply btn-hover">删除</span>
         </div>
       </div>
     </div>
    })}
  </div>
  )
}
export default List